<!DOCTYPE html>
<!-- Created by 白墨 on 2021/4/17 22:31:58-->
<html lang="zh-cmn-Hans-CN"  xmlns:th="http://www.thymeleaf.org">

<head th:replace="admin/_fragments::head(~{::title})">
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>标签管理</title>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css">
  <link rel="stylesheet" href="../../static/css/me.css">
</head>

<body>
<!-- 导航 -->
<nav th:replace="admin/_fragments::menu(3)" class="ui inverted attached segment">

</nav>


<div class="ui attached pointing menu tm-hf">
  <div class="ui container">
    <div class="right menu" style="margin-right: 150px;">
      <a href="#" th:href="@{/admin/tags/input}" class="item">发布</a>
      <a href="#" th:href="@{/admin/tags}"  class="blue active item">列表</a>
    </div>
  </div>
</div>
<!--中间内容-->
<div  class="m-container-small m-padded-tb-big">
  <div class="ui container form" th:classappend="${result!=null?(result?'success':'error'):''}">
    <div class="ui message" th:classappend="${result!=null?(result?'success':'error'):'success'}">
      <i class="close icon"></i>
      <div class="header">提示：</div>
      <p th:text="${message}">恭喜，操作成功！</p>
    </div>
    <table class="ui compact blue table">
      <thead>
      <tr>
        <th class="four wide center aligned">序号</th>
        <th class="four wide center aligned">名称</th>
        <th class="four wide center aligned">操作</th>
      </tr>
      </thead>
      <tbody>
      <tr th:each="type,iterStat : ${page.list}">
        <td th:text="${iterStat.count}">1</td>
        <td th:text="${type.name}">刻意练习清单</td>
        <td>
          <a href="#" th:href="@{/admin/tags/{id}/input(id=${type.id})}" class="ui mini blue basic button">编辑</a>
          <a href="#" onclick="return confirm('确认要删除吗？')" th:href="@{/admin/tags/{id}/delete(id=${type.id})}" class="ui mini red basic button">删除</a>
        </td>
      </tr>
      </tbody>
      <tfoot>
      <tr>

        <th colspan="2">
          <div class="ui mini pagination menu" th:if="${page.pages}>1">
            <a th:href="@{/admin/tags(pageNum=1)}" class=" item">首页</a>
            <a th:href="@{/admin/tags(pageNum=${page.hasPreviousPage}?${page.prePage}:1)}" class="  item" th:if="${page.hasPreviousPage}">上一页</a>
            <a th:href="@{/admin/tags(pageNum=${page.hasNextPage}?${page.nextPage}:${page.pages})}" class=" item" th:if="${page.hasNextPage}">下一页</a>
            <a th:href="@{/admin/tags(pageNum=${page.pages})}" class=" item">尾页</a>
          </div>
        </th>
        <th>
          当前 <span th:text="${page.pageNum}"></span> 页,总 <span th:text="${page.pages}"></span> 页,共 <span th:text="${page.total}"></span> 个分类
          <a href="#" th:href="@{/admin/tags/input}" class="ui mini right blue basic button">新增</a>
        </th>
      </tr>
      </tfoot>
    </table>
  </div>
</div>

<br>
<br>

<!-- 底部 -->
<footer th:replace="admin/_fragments::footer" class="ui inverted vertical segment m-padded-tb-massive">

</footer>


<script src="https://lib.baomitu.com/jquery/3.5.1/jquery.js"></script>
<script src="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.js"></script>


<script>
  $('.menu.toggle').click(function() {
    $('.m-item').toggleClass('m-mobile-hide');
  });

  $('.ui.dropdown').dropdown({
    on: 'hover'
  });

  //消息提示关闭初始化
  $('.message .close')
          .on('click', function () {
            $(this)
                    .closest('.message')
                    .transition('fade');
          });
  $('#newblog-container').load("[[@{/footer/newblog}]]");
</script>
</body>

</html>